﻿@model KRM.Core.tblOrder
@{
    ViewBag.Title = "Pick History";
    Layout = "~/Views/Shared/_PopupLayout.cshtml";
    var pickedHistories = Model.PickedHistories();
    var pickscannedhistories = Model.PickScannedPartsHistories().ToList();
    var unloadcannedhistories = Model.UnloadScannedPartsHistories().ToList();
    var deliveryMapPositions = Model.DeliveryMapPositions().OrderByDescending(a => a.LastUpdated).ToList();
    var deliveryHistories = Model.DeliveryHistories().ToList();
}
<div class="padding10">
    <div class="box">
        <div class="box-title" >
            <h4><i class="icon-check" style="color: #777"></i> Pick History</h4>
        </div>
        <div class="box-content" style="padding: 20px 20px 20px 10px; border: solid 1px gainsboro">
            @foreach (var loadid in pickedHistories.Select(p => p.LoadID).Distinct().ToList())
            {
                var pickedBy = pickedHistories.FirstOrDefault(p => p.LoadID == loadid);
                if (pickedBy != null)
                {
                    <div class="row-fluid">
                        <div class="span5"><b>Picked By: </b> @pickedBy.ActionByName</div>
                        <div class="span4"><b>Picked Date:</b> @((pickedBy.ActionTime??new DateTime()).ToString("dd/MM/yyyy HH:mm:ss")) </div>
                        <div class="span3"><b>LoadId:</b> @pickedBy.LoadID</div>
                    </div>
                    
                    <div class="row-fluid">
                           <div class="fieldset">
                               <div class="legend"><span class="">PickingApp Scanned Parts History:</span></div> 
                               <div>
                               @foreach (var item in pickscannedhistories.Where(p => p.LoadId == loadid))
                                    {
                                      @Html.Raw(item.Description)
                                    }</div>
                              </div>
                        </div>
                
                }
            }
        </div>
    </div>
    <div class="box">
        <div class="box-title" >
            <h4><i class=" icon-truck" style="color: #777"></i> Delivery History</h4>
        </div>
        <div class="box-content" style="padding: 20px 20px 20px 10px; border: solid 1px gainsboro">
            
            @foreach (var loadid in deliveryHistories.Select(p=>p.LoadID).Distinct())
            {
                var deliveryBy = deliveryHistories.FirstOrDefault(p => p.LoadID == loadid);
                if (deliveryBy != null)
                {
                    <div class="row-fluid">
                        <div class="span5"><b>Delivery By:</b>  @deliveryBy.ActionByName</div>
                        <div class="span4"><b>Delivery Date:</b> @deliveryBy.ActionTime </div>
                        <div class="span3"><b>LoadId: </b>@deliveryBy.LoadID</div>
                    </div> 
                }
                <div class="row-fluid">
                    <div class="fieldset">
                         <div class="legend"><span class="">Driverapp Scanned Parts History:</span></div> 
                        @foreach (var item in unloadcannedhistories.Where(p => p.LoadId == loadid))
                        {
                            @Html.Raw(item.Description)
                        }
                    </div>
                </div>
            }
            @if (deliveryMapPositions.Count > 0)
            {
                var firstLocation = deliveryMapPositions.FirstOrDefault();
                <div class="row-fluid">
                    <label> Delivery Locations</label>
                </div>
                <div class="row-fluid">
                    <div id="map-canvas" style="height: 400px; width: 100%"></div>
                </div>
                <script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCgoFNKXf7DaoHEl8niPdNnEYZnAfRMQDM&sensor=false&v=3.7"></script>
                <script>
                    var map;
                    function LoadPosition(lat,lng,orderref,loadid,drivername,lastupdated,devicename,deviceuid) {
                        var contentString = '<div id="content" style="width:300px">'
                            + '<h5>'+orderref+' - Load: '+loadid+'</h5>'
                            + '<div id="bodyContent">' 
                            + '<p>Driver: '+drivername+'</p>'
                            + '<p>Date: '+lastupdated+'</p>'
                            + '<p>DeviceName: '+devicename+'</p>'
                            + '<p>DeviceUID: '+deviceuid+'</p>'
                            + '</div></div>';

                        var infowindow = new google.maps.InfoWindow({content: contentString});
                        var marker = new google.maps.Marker({
                            position: new google.maps.LatLng(lat, lng),
                            map: map,
                            title: orderref
                        });
                        google.maps.event.addListener(marker, 'click', function() {
                            infowindow.open(map,marker);
                        });
                    }

                    $(document).ready(function() {
                        var myLatlng = new google.maps.LatLng(@(firstLocation.Lat), @(firstLocation.Lng));
                        var mapOptions = {
                            zoom: 10,
                            center: myLatlng
                        };
                        map = new google.maps.Map(document.getElementById('map-canvas'),
                            mapOptions);
                    });
                </script>
                
                foreach (var item in deliveryMapPositions)
                {
                    <script>
                        $(document).ready(function() {
                            LoadPosition(@item.Lat, @item.Lng, '@item.OrderRef', @item.LoadId, '@item.DriverName', '@item.LastUpdated', '@item.DeviceName', '@item.DeviceUUID');
                        });
                    </script>
                }
            }
        </div>
    </div>
</div>
